<template>
  <div class="search border-bottom">
  	<div class="iconfont search_icon">&#xe6ac;</div>
  	<input type="text" value="" placeholder="天气丹" class="search_input" readonly="readonly" @click="search_page">
  	<div class="search_activity" @click="go_activity"><img :src="img_url" alt=""></div>
  </div>
</template>

<script>
export default {
  name: 'search',
  data(){
  	return{
  		img_url:'http://img.tepin.hk/HWG-DE/2018-01-16/5a5d948af26d7.png',
  		img_link:'m.tepin.hk'
  	}
  },
  props: {
    
  },
  methods:{
  	go_activity(){
  		this.$router.push('/activity')
  	},
  	search_page(){
  		this.$router.push('/search_page')
  	}
  }
}
</script>
<style lang="stylus" scoped>
@import '~@/assets/css/varibles.styl'

.search{background:$bgColor;width:100%;display: -webkit-box;display: -webkit-flex;display: flex;height:50px;box-sizing:border-box;touch-action: none}
.search_icon{width:0.6rem;height:0.6rem;line-height:0.6rem;text-align:center;color:#999;background:#eee;border-top-left-radius:0.1rem;border-bottom-left-radius:0.1rem;margin-top:0.15rem;margin-left:0.15rem;}
.search_input{-webkit-box-flex: 1;-webkit-flex: 1;flex: 1;border-top-right-radius:0.1rem;border-bottom-right-radius:0.1rem;border-top-left-radius:0;border-bottom-left-radius:0;color:#666;font-size:0.25rem;background:#eee;height:0.6rem;margin-top:0.15rem;}
.search_activity{width:0.9rem;height:0.9rem;}
.search_activity img{width:100%;}
</style>
